import React from 'react'
const Context = React.createContext()
// 上下文是父组件提供   所有的后代组件都可以调用 类似于 vue的 provide/inject

// connect 是为了通过上下文接收store并且利用回调函数传递参数
// 还有就似乎实现了组建的更新
export function connect(mapStateToProps, mapDispatchToProps) {
  return function (Comp) {
    return class Temp extends React.Component {
      static contextType = Context
      componentDidMount() {
        // console.log(888);
        this.clear = this.context.store.subscribe(() => {
          // console.log(666);
          this.setState({})
        })
      }
      componentWillUnmount() {
        this.clear()
      }
      render() {
        return <Comp
          {...mapStateToProps(this.context.store.getState())}
          {...mapDispatchToProps(this.context.store.dispatch)}
        />
      }
    }
  }
}

// Provider 实现了通过上下文的方式把store传给后代组件
export class Provider extends React.Component {

  render() {
    let { store, children } = this.props;
    return <Context.Provider value={{ store: store }}>
      {children}
    </Context.Provider>
  }
}